<template>
  <div>
    <!-- 首页轮播图 -->
    <swifter :list="list"></swifter>

    <!-- 首页九宫格 -->
    <ul class="mui-table-view mui-grid-view mui-grid-9">
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="/home/news-list">
          <span class="mui-icon mui-icon-home"></span>
          <div class="mui-media-body">News</div>
        </router-link>
      </li>
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="#">
          <span class="mui-icon mui-icon-email">
            <span class="mui-badge">5</span>
          </span>
          <div class="mui-media-body">Email</div>
        </router-link>
      </li>
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="/home/goods-list">
          <span class="mui-icon mui-icon-chatbubble"></span>
          <div class="mui-media-body">Goods</div>
        </router-link>
      </li>
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="#">
          <span class="mui-icon mui-icon-search"></span>
          <div class="mui-media-body">Search</div>
        </router-link>
      </li>
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="#">
          <span class="mui-icon mui-icon-gear"></span>
          <div class="mui-media-body">Setting</div>
        </router-link>
      </li>
      <li class="mui-table-view-cell mui-media mui-col-xs-4 mui-col-sm-3">
        <router-link to="#">
          <span class="mui-icon mui-icon-more"></span>
          <div class="mui-media-body">more</div>
        </router-link>
      </li>
    </ul>
  </div>
</template>

<script>
// 导入轮播图组件
import Swifter from '../subComponents/Swifter.vue';

export default {
  data () {
    return {
      list: [
        { src: 'https://m.360buyimg.com/babel/jfs/t1/17391/35/6338/26523/5c4e9902E2992cfd5/27b45bfc054a9e12.jpg' },
        { src: 'https://m.360buyimg.com/babel/jfs/t1/27134/31/6335/94042/5c4fe883E94041b0b/8c77ae275c6f6ac6.jpg' },
        { src: 'https://m.360buyimg.com/babel/jfs/t1/19661/28/6401/87419/5c510327Ed4452476/112c2ba65acc70bb.jpg' }  
      ]
    }
  },
  components: {
    Swifter
  }
}
</script>

<style scoped>
.mint-swipe {
  height: 200px;
  background-color: orange;
}
</style>
